<template>
	<view class="recharge">
		<navBar title="充值记录"></navBar>
		<view class="list flex_r_between" v-for="(item,index) in list" :key="index">
			<view class="left">
				<view class="title">
					<rich-text :nodes="item.message"></rich-text>
				</view>
				<view class="time">
					<uni-dateformat :date="item.create_time" format="yyyy-MM-dd hh:mm"></uni-dateformat>
				</view>
			</view>
			<view class="right">+ {{Math.floor(item.change_price)}}曝光量</view>
		</view>
		<empty v-if="!list.length"></empty>
	</view>
</template>

<script>
	import empty from '@/compentents/empty/empty.vue';
	import navBar from '@//compentents/navBar/navBar.vue'
	export default {
		components: {
			empty,
			navBar,
		},
		data() {
			return {
				page: 1,
				total: 0,
				list: [],
			}
		},
		methods: {
			getList() {
				this.$get('/popularize/getBalanceLog', {
					type: 1,
					page: this.page
				}).then(res => {
					this.total = res.data.total;
					this.list.push(...res.data.data);
				})
			},
		},

		onLoad() {
			this.getList();
		},

		onReachBottom() {
			if (this.total > this.list.length) {
				this.page++;
				this.getList();
			}
		}
	}
</script>

<style scoped lang="less">
	.recharge {
		padding: 16rpx 32rpx;
	}

	.list {
		padding: 32rpx 0;

		.left {
			.title {
				font-weight: 500;
				font-size: 28rpx;
				color: #131313;

				span {
					font-size: 28rpx !important;
				}
			}

			.time {
				font-size: 26rpx;
				color: #666666;
				margin-top: 10rpx;
			}
		}

		.right {
			font-weight: 500;
			font-size: 28rpx;
			color: #FD2A53;
		}
	}
</style>